<template>
	<div class="searthedwarper">
		<ul style="padding-bottom: 2rem;">
			<li v-for="(item,index) in searthedfood" class="g-in-food">
				<div class="g-in-icon">
								<img :src="item.src | imgurl" />
							</div>
							<div class="g-in-content">
								<h2 class="g-in-name">{{item.listName}}</h2>
								<div class="g-in-price">
									<span class="g-new">￥{{item.listin[0].price}}/{{item.listin[0].listName}}</span>
									<span class="g-old" v-show="item.oldPrice">￥{{item.listin[0].price}}</span>
								</div>
								<div class="cartwraper">
									<change v-if="item.listin.length==1" :food="item.listin[0]"></change>
									<div v-else class="specif" @click.stop="triggerspecif(item)">
										<num :foodtype=item></num>
										选规格
									</div>
								</div>
							</div>
			</li>
		</ul>
	</div>
</template>

<script>
	import change from '../shopcart/change'
	import num from './num'
	export default{
		data() {
			return{
				q:0
			}
		},
		props:["searthedfood"],
		computed:{
			
		},
		methods:{
			triggerspecif:function(item){
				this.$emit("triggerspecif",item)
			}
		},
		filters: {
        imgurl: function(value) {
            return 'http://www.dadu999.com'+value;
        }
    },
		components:{
			change,
			num
		}
	}
</script>

<style lang="stylus">
  .searthedwarper
	  position absolute
	  width 100%
	  height 100%
	  top 0.88rem
	  bottom 1rem
	  z-index 100
	  background white
	  overflow scroll
	  ul
      li
        padding-bottom 18px
        display flex
        margin 0.2rem
        border-bottom 1px solid rgba(7,17,27,0.1)
        &:last-child
          border-bottom 0px
          margin-bottom 0
        .g-in-icon
          flex 0 0 2rem 
          img
            width: 1.5rem;
            height: 1.5rem;
            border-radius 0.1rem;
        .g-in-content
          flex 1
          position relative
          .g-in-name
            text-align left
            padding-left 0.2rem
            margin 2px 0 2px 0
            line-height 0.3rem
            font-size 0.35rem
            font-weight 700
            color rgb(7,17,27)
          .g-in-price
            position absolute
            bottom 0.05rem
            font-weight 700
            line-height 0.5rem
            text-align left
            padding-left 0.2rem
            span
              font-size 0.3rem 
          .cartwraper
            position absolute
            right 0
            bottom 0
            z-index 20
            .specif
              width 1rem
              position absolute
              right 0
              bottom 0
              height 0.5rem
              background #00a0dc
              font-size 0.23rem
              color white
              border-radius 0.5rem	           
              line-height 0.54rem
              font-weight 700
              i
                width 0.25rem
                height 0.25rem
                position absolute
                right -0.2rem
                top -0.2rem
                border-radius 50%
                color white
                line-height 0.2rem
                background black
                font-weight 700
                font-size 0.2rem
</style>